<template>
	<div class="app-login">
		<div class="app-login__background"></div>
		<div class="app-login__header">
			<div class="header__logo">
				<img src="@/assets/img/logo.png" />
			</div>
			<div class="header__text">{{ appConfig.appTitle }}</div>
		</div>
		<div
			:title="appConfig.appTitle"
			:bordered="false"
			class="app-login__centent"
		>
			<div class="login-form">
				<van-cell-group inset>
					<van-field
						v-model="store.username"
						name="用户名"
						:label="$t('common.login.username', '用户名')"
						:placeholder="$t('common.login.userplaceholder', '请输入用户名')"
						:rules="[{ required: true, message: '请填写用户名' }]"
					/>
					<van-field
						v-model="store.password"
						type="password"
						name="密码"
						:label="$t('common.login.password', '密码')"
						:placeholder="$t('common.login.pwdplaceholder', '请输入密码')"
						:rules="[{ required: true, message: '请填写密码' }]"
					/>
				</van-cell-group>
				<div class="app-login__buttons">
					<van-button class="" type="primary" size="large" @click="handleLogin"
						>{{ $t('common.login.login', '登录') }}
					</van-button>
					<van-button size="large" @click="handleReset">{{
						$t('common.login.reset', '重置')
					}}</van-button>
				</div>
			</div>
			<div class="login__tool">
				<van-checkbox
					class="login__tool__rememberme"
					v-model="store.rememberme"
					shape="square"
					>{{ $t('common.login.remember', '记住我') }}</van-checkbox
				>
				<div class="login__tool__find-password">
					{{ $t('common.login.findpassword', '找回密码') }}
				</div>
			</div>
			<div class="app-login__footer">
				{{ $t('common.login.findpassword', '还没有账号') }}？<span>{{
					$t('common.login.registernow', '立即注册')
				}}</span>
			</div>
		</div>
	</div>
</template>

<script setup lang="ts">
import { useRoute, useRouter } from 'vue-router';
import { getDcSystemIdViewParam } from '@/utils';
import { Http } from '@/http';
import { setCookie } from 'qx-util';
interface FormState {
	username: string;
	password: string;
	rememberme: Boolean;
}
const store = reactive<FormState>({
	username: 'train_admin',
	password: '123456',
	rememberme: false,
});

const appConfig = App.getAppConfig();
const route: any = useRoute();
const { push } = useRouter();
const handleLogin = async () => {
	App.clearAppData();
	const headers = {};
	const tempViewParam = getDcSystemIdViewParam();
	if (tempViewParam && tempViewParam.srfdcsystem) {
		Object.assign(headers, { srfdcsystem: tempViewParam.srfdcsystem });
	}
	const requestData = {
		loginname: store.username,
		password: store.password,
	};
	try {
		const response = await Http.getInstance().post(
			'/v7/login',
			requestData,
			headers,
			true
		);
		if (response && response.success) {
			const data = response.data;
			if (data && data.token) {
				setCookie('ibzuaa-token', data.token, 7, true);
			}
			if (data && data.user) {
				setCookie('ibzuaa-user', JSON.stringify(data.user), 7, true);
			}
			// 设置cookie,保存账号密码7天
			setCookie('loginname', store.username, 7, true);
			// 跳转首页
			const url = route.query.redirect || '/';
			push({ path: url });
		}
	} catch (error: any) {
		if (error && error.data && error.data.message) {
			App.getNotificationHelper().error(error.data.message);
		}
	}
};

const handleReset = () => {
	store.username = '';
	store.password = '';
};

const handleThridLogin = (type: string) => {
	if (!type) return;
	switch (type) {
		case 'DINGDING':
			console.warn(`暂不支持钉钉登录`);
			break;
		case 'WXWORK':
			console.warn(`暂不支持企业微信登录`);
			break;
		default:
			console.warn(`暂不支持${type}登录`);
			break;
	}
};
</script>
